<template>
<div class="img-code-wrapper">
  <img v-if="codeBase64" @click="getCode" :src="'data:image/png;base64,' + codeBase64">
  <span v-else @click="getCode">图形验证码</span>
</div>
</template>
<script>
export default {
  props: {
    codeBase64: {
      type: String,
      default: ''
    }
  },
  methods: {
    getCode () {
      this.$emit('get')
    }
  }
}
</script>
<style scoped lang="scss">
@import "../../assets/scss/base.scss";
div{
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  cursor: pointer;
  img{
    width: 100%;
    height: 100%;
  }
  span{
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -7px;
    margin-left: -30px;
    display: inline-block;
    vertical-align: top;
    width: 60px;
    height: 14px;
    font-size: 12px;
  }
}
</style>
